<style>

    .news-list {
        column-width:310px;
        column-gap: 20px;
        padding-left:20px;
        padding-right:20px;
    }

    .news-list .item{
        display:inline-block;
        margin-top:20px;
    }


</style>

<div data-dux="table-bind">
    <div class="dux-page-header uk-clearfix">
        <div class="page-title">
            <a class="uk-button uk-button-danger" href="javascript:;" id="sync"> 同步素材</a>
        </div>
        <div class="page-action">
            <a class="uk-button uk-button-primary" href="{url('add')}">添加</a>
        </div>
    </div>
    <div class="news-list uk-clearfix" data-table >
        <!--loop{$list as $vo}-->
        <?php $data = unserialize($vo['data']); ?>
        <div class="item tr">
            <div class="dux-material-panel">
                <a class="panel-top" href="{$data[0]['url']}" target="_blank">
                    <div class="body">
                        <img src="{$data[0]['image']}" alt="">
                        <h2 data-title>{$data[0]['title']}</h2>
                    </div>
                </a>
                <div class="panel-list">
                    <!--loop{$data as $key => $v}-->
                        <!--if{$key > 0}-->
                        <a class="panel-item uk-clearfix" href="{$v.url}" target="_blank">
                            <div class="pic">
                                <img src="{$v.image}" alt="">
                            </div>
                            <h3 data-title>{$v.title}</h3>
                        </a>
                        <!--{/if}-->
                    <!--{/vo}-->
                </div>
                <div class="panel-del">
                    <a href="javascript:" data-del data-url="{url('del')}" data-id="{$vo.material_id}">删除</a>
                </div>
            </div>

        </div>
        <!--{/loop}-->
    </div>
    <div class="dux-page-foot uk-clearfix">
        {$page}
    </div>
</div>
<script>
    Do('base', 'dialog', function () {
        var dialog = null;
        var sync = function (pageNum) {
            app.debug(pageNum);
            app.ajax({
                url: '{url("sync")}',
                type: 'post',
                data: {
                    page: pageNum
                },
                tip: false,
                success: function (info) {
                    dialog.close();
                    dialog.msg('素材完成页数(' + info.num + '/' + info.max + ')', 200);
                    sync(pageNum + 1);
                },
                error : function(msg, url) {
                    dialog.close();
                    dialog.msg(msg);
                    if(url) {
                        setTimeout(function() {
                            window.location.href = url;
                        }, 2000);
                    }
                }
            });

        };

        $('#sync').click(function () {
            dialog.confirm({
                title : '同步素材将会删除已有本地数据,并耗费大量资源,请确认？',
                callback : [
                    function() {
                        layer.msg('同步中,请稍等!');
                        sync(1);
                    }
                ]
            });
        });
    });
</script>